<?php

require_once $_SERVER['DOCUMENT_ROOT'].'/common.php';
page::printTop();
?>


<div id="view_image_outer">
<img id="view_image" src=mm.jpg />
</div>

<script>
$(function(){
	var writeData = function(left, top, image_width, image_height, image_left, image_top) {
		var x=(left-image_left)/image_width;
		var y=(top-image_top)/image_height;
		alert(x+', '+y);
	}

	var confirmPublish = function() {
		if (!confirm("确认发表？"))
		{
			$('#circle_box').remove();
			return false;
		}
		
		var str=$('#circle_box').children('input').attr('value')+'';
		
		var left=$('#circle_box').offset().left;
		var top=$('#circle_box').offset().top;
		
		if (!str.length) return false;
		var item=$('<div class="view_circle">'+str+'</div>') 
			.css({"left":left,"top":top});
		$('#circle_box').remove();
		item.appendTo($('#view_image_outer'));
		
		writeData(left, top, $('#view_image').width(), $('#view_image').height(),
			$('#view_image').offset().left, $('#view_image').offset().top);
	}

	$('#view_image').bind('click', function(ev){
		if ($('#circle_box').size())
		{
			$('#circle_box').remove();
		}
		
		var box=$('<div id="circle_box"><input /></div>')
			.css({"left":ev.pageX,"top":ev.pageY})
			.keypress(function(e) {
				if (e.which == 13) {
				 	confirmPublish();
				} else if (e.which == 27) {
				 	$(this).remove();
				}
			});

		box.appendTo($('#view_image_outer'));
	});
});
</script>

<?php
page::printTail();
